$(function() {
    // 第一步 一进来就显示左边一级分类的数据
    // 所以 一进来就要发送ajax请求
    $.ajax({
        url: '/category/queryTopCategory',
        type:'get',
        // data: {},
        success:function(res) {
            console.log(res);
            if(res.rows.length>0) {
                for(var i=0;i<res.rows.length;i++) {
                    var item=res.rows[i];
                    // 自定义属性 动态绑定id
                    var a=$(`<a href='#' data-id='${item.id}'>${item.categoryName}</a>`)
                    $('.leftfirst').append(a);
                }
                var firstItem=res.rows[0];
                $('.leftfirst').find('a:first-child').addClass('active').siblings().removeClass('active');
                //一进来获取二级分类的数据
                var ids=$('.leftfirst').find('a:first-child').attr('data-id');
                console.log(ids);
                
                $.ajax({
                    url: ' /category/querySecondCategory',
                    type: 'get',
                    data: {
                        id: ids,
                    },
                    success: function(res) {
                        console.log(res);
                        if(res.rows.length>0) {
                            for(var i=0;i<res.rows.length;i++) {
                                var item=res.rows[i];
                                // 自定义属性 动态绑定id
                                var a=$(`
                                <li>
                                    <a href='#'>
                                        <img src='${item.brandLogo}'>
                                        <span>${item.brandName}</span>
                                    </a>
                                </li>
                                `
                                )
                                $('.ulBox').append(a);
                            }
                        }else {
                            $('.ulBox').html('暂无数据');
                        }
                    },
                    beforeSend:function() {
                        $('.ulBox').html('');
                    }
                })
            }
        },
        error:function(err) {
            console.log(err);
            
        }
    })
    // 怎么去获取id
    $('.leftfirst').on('tap','a',function() {
        var ids=$(this).attr('data-id');
        // alert('aaa');
        console.log(ids);
        $.ajax({
            url: ' /category/querySecondCategory',
            type: 'get',
            data: {
                id:ids,
            },
            success: function (res) {
                console.log(res);

                // id: 1, brandName: "耐克", categoryId: 1, brandLogo: "/mobile/images/brand1.png", isDelete: 1, 

                if (res.rows.length > 0) {
                    for (var i = 0; i < res.rows.length; i++) {
                        var item = res.rows[i];
                        //自定义属性 动态绑定id
                        var a = $(
                            `
                        <li>
                            <a href="#">
                                    <img src="${item.brandLogo}" alt="">
                                    <span>${item.brandName}</span>
                            </a>
                        </li>
                        `
                        )
                        $('.ulBox').append(a)
                    }

                } else {
                    $('.ulBox').html('暂无数据');
                }

            },
            beforeSend: function () {
                $('.ulBox').html('')
            }

        
        })
        $(this).addClass('active').siblings().removeClass('active');
    })
})

